<template id="head">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <title>Webduino Blockly - 控制三軸加速度計旋轉圖片角度</title> 
  <!-- webduino -->
  <script src="https://webduino.io/components/webduino-js/dist/webduino-all.min.js"></script>
  <script src="https://blockly.webduino.io/webduino-blockly.js"></script>
  <script src="https://blockly.webduino.io/lib/runtime.min.js"></script>
</template>
<template id="body">
  <div id="show">
  x: <span id="x"></span><br/>
  y: <span id="y"></span><br/>
  z: <span id="z"></span><br/>
  roll: <span id="r"></span><br/>
  pitch: <span id="p"></span><br/>
  </div>
    <div id="box">
    <img src="http://blockly.webduino.io/media/webduino-logo.jpg" id="image">
  </div>
</template>
<template id="css">
#box{
  position:relative;
}
#image{
  position:absolute;
  top:0;
  left:0;
  width:200px;
  transform-origin:150px 150px;
}
#show{
  font-size:16px;
  margin-bottom:10px;
}
</template>
